const { defineConfig } = require('@vue/cli-service')
const AutoImport = require('unplugin-auto-import/webpack')
const Components = require('unplugin-vue-components/webpack')
const { ElementPlusResolver } = require('unplugin-vue-components/resolvers')

module.exports = defineConfig({
  transpileDependencies: true, // 转译依赖
  configureWebpack: {
    plugins: [
      AutoImport({
        vueTemplate: true, // 是否在 vue 模板中自动导入
        include: [
          /\.[tj]sx?$/, // .ts, .tsx, .js, .jsx
          /\.vue$/,
          /\.vue\?vue/, // .vue
          /\.md$/ // .md
        ],
        resolvers: [ElementPlusResolver()],
        imports: ['vue', 'pinia', 'vue-router'],
        dts: true // 生成类型文件
      }),
      Components({
        resolvers: [
          ElementPlusResolver({
            // importStyle: 'scss' // 使用 scss 样式
          })
        ],
        // extensions: ['vue', 'tsx'], // 自动导入的文件类型，默认是 ['vue', 'ts', 'jsx', 'tsx', 'md']
        dts: true // 生成类型文件
      })
    ]
  }
})
